<template>
  <div class="app-car-container">
    <CustomContent>
      <template v-slot:body>
        <div>
          <el-form ref="form" :model="form" :rules="rules" label-width="160px" label-position="right" size="small" inline>
            <el-row :gutter="15">
              <el-row>
                <el-col :span="24">
                  <MmvTitle title="客户信息"></MmvTitle>
                </el-col>
                <el-col :span="24">
                  <el-form-item label="选择客户" prop="memberName">
                    <div style="display: inline-block" @click="showCustomer = true">
                      <el-input :value="form.memberName" style="width: 220px; margin-right: 15px" placeholder="请选择客户"
                                readonly>
                        <el-button icon="el-icon-search" slot="append" @click="showCustomer = true"></el-button>
                      </el-input>
                    </div>

                    <div style="display: inline-block">
                      未找到客户?
                      <el-button type="text" @click="showAddCustomer = true">点击立即添加
                      </el-button>
                    </div>
                  </el-form-item>
                </el-col>
                <template v-if="kehu.memberNo">
                  <el-col :sm="12" :md="8">
                    <el-form-item label="客户类型">{{
                        kehu.memberType | memberType
                      }}
                    </el-form-item>
                  </el-col>

                  <el-col :sm="12" :md="8" v-if="kehu.memberType == 1">
                    <el-form-item label="企业联系人">{{
                        kehu.contactMember || '--'
                      }}
                    </el-form-item>
                  </el-col>
                  <el-col :sm="12" :md="8">
                    <el-form-item label="客户来源">
                      <dict-tag
                        :options="dict.type.memberSource"
                        :value="kehu.memberSource"
                      />
                    </el-form-item>
                  </el-col>
                  <el-col :sm="12" :md="8">
                    <el-form-item label="证件号码">{{
                        kehu.cardId || '--'
                      }}
                    </el-form-item>
                  </el-col>
                  <el-col :sm="12" :md="8">
                    <el-form-item label="联系方式">{{
                        kehu.contactPhone || '--'
                      }}
                    </el-form-item>
                  </el-col>
                  <el-col :sm="12" :span="24">
                    <el-form-item label="联系地址">{{ kehu.contactAddress || '--' }}
                    </el-form-item>
                  </el-col>
                </template>
              </el-row>

              <el-col :span="24">
                <MmvTitle title="预定信息"></MmvTitle>
              </el-col>

              <el-row>
                <el-col :span="24">
                  <el-form-item label="方案类型" prop="useTimeType">
                    <el-radio-group v-model="form.useTimeType" style="width: 100%" @change="getFeeData()">
                      <el-radio :label="3" value="3">按月</el-radio>
                      <el-radio :label="2" value="2">按天</el-radio>
                      <el-radio :label="1" value="1">按小时</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="12">
                  <el-form-item label="取还车门店" prop="storeName">
                    <div style="display: flex">
                      <el-input :value="form.storeName"
                                @click.native="handleChooseStore(1)" readonly
                                placeholder="请选择门店">
                        <el-button icon="el-icon-search" slot="append" @click="handleChooseStore(1)"></el-button>
                      </el-input>
                    </div>
                  </el-form-item>
                </el-col>
<!--                <el-col :span="12">-->
<!--                  <el-form-item label="还车门店" prop="reserveStoreName">-->
<!--                    <div style="display: flex">-->
<!--                      <el-input :value="form.reserveStoreName"-->
<!--                                @click.native="handleChooseStore(2)" readonly-->
<!--                                placeholder="请选择门店">-->
<!--                        <el-button icon="el-icon-search" slot="append"-->
<!--                                   @click="handleChooseStore(2)">-->
<!--                        </el-button>-->
<!--                      </el-input>-->
<!--                    </div>-->
<!--                  </el-form-item>-->
<!--                </el-col>-->
              </el-row>

              <el-row>
                <el-col :span="12">
                  <el-form-item label="预定时间" prop="rentalStartTime">

                    <template v-if="3==form.useTimeType">
                      <el-date-picker v-model="form.rentalStartTime" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss"
                                      placeholder="选择开始时间" @change="calcEndTime"
                                      type="datetime" style="width: 190px" :clearable="false"></el-date-picker>
                        &nbsp;&nbsp;租期(月)&nbsp;<el-input-number v-model="form.tenancyTerm" :precision="0" :min="1" :max="120" label="" @change="calcEndTime"></el-input-number>
                    </template>



                    <el-date-picker v-else v-model="orderTimeRange" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss"
                                    type="datetimerange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
                                    @change="changeTime" style="width: 360px" :clearable="false">
                    </el-date-picker>
                  </el-form-item>
                </el-col>

                <el-col :span="12">
                  <el-form-item label="品牌/车系/车型" prop="modelInfo">
                    <div style="display: flex" @click="showSelModel">
                      <el-input v-model="form.modelInfo" placeholder=""  readonly>
                        <el-button icon="el-icon-search" slot="append" @click="showSelModel"></el-button>
                      </el-input>
                    </div>
                  </el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="24" v-if="3==form.useTimeType">
                  <el-form-item label="结算方式" prop="methodPayment">
                    <el-radio-group v-model="form.methodPayment" style="width: 100%">
                      <el-radio :label="1" value="1">按单月支付租金</el-radio>
                      <el-radio :label="2" value="2">一次性支付</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-col>
              </el-row>

              <el-row v-show="2==form.useTimeType">
                <el-col :span="12">
                  <el-form-item label="里程数(KM)">
                    <el-input v-model="form.kilometers" disabled
                              @keyup.native="form.kilometers = oninput(form.kilometers,2)"
                              @blur="form.kilometers = oninput(form.kilometers,2)"
                              placeholder="选择车型后带出" type="number">
                    </el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="12">
                  <el-form-item label="用车时间(小时)">

                    <el-input-number disabled v-model="form.setUseTimes" :precision="0" :min="1" :max="24" label="选择车型后带出"></el-input-number>

                    <!--                    <el-input v-model="form.bbb" placeholder="请输入用车时间" type="number">-->
                    <!--                    </el-input>-->
                  </el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="12">
                  <el-form-item label="是否需要司机" prop="isUseDriver">
                    <el-switch
                      :active-value="1"
                      :inactive-value="0"
                      v-model="form.isUseDriver">
                    </el-switch>
                  </el-form-item>
                </el-col>

                <el-col :span="12" v-if="1==form.isUseDriver">
                  <el-form-item label="司机类型">
                    <el-radio-group v-model="form.driverType" style="width: 100%" @change="changeDriverType">
                      <el-radio :label="1" value="1">内部</el-radio>
                      <el-radio :label="2" value="2">外部</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-col>
              </el-row>

              <el-row v-if="1==form.isUseDriver">
                <el-col :span="12">
                  <el-form-item label="选择司机">
                    <div style="display: inline-block" @click="showSelDriver">
                      <el-input :value="form.driverName" style="width: 220px; margin-right: 15px" placeholder="请选择司机"
                                readonly>
                        <el-button icon="el-icon-search" slot="append" @click="showSelDriver"></el-button>
                      </el-input>
                    </div>
                  </el-form-item>
                </el-col>

                <el-col :span="12" v-if="2==form.driverType">
                  <el-form-item label="代驾费(元)" prop="valetDrivingFee">
                    <el-input v-model="form.valetDrivingFee" placeholder="请输入代驾费"
                              @keyup.native="form.valetDrivingFee = oninput(form.valetDrivingFee, 2)"></el-input>
                  </el-form-item>
                </el-col>

              </el-row>

              <template>
                <el-col :span="24">
                  <MmvTitle title="费用信息"></MmvTitle>
                </el-col>
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="车辆租金（元）" prop="rent">
                      <el-input v-model="form.rent" placeholder="请输入车辆租金" disabled
                                @keyup.native="form.rent = oninput(form.rent, 2)"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="车辆押金（元）" prop="deposit">
                      <el-input v-model="form.deposit" placeholder="请输入车辆押金" disabled
                                @keyup.native="form.deposit = oninput(form.deposit, 2)"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="备注">
                      <el-input type="textarea" v-model="form.remark" placeholder="请输入备注"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>

                <el-row >
                  <el-col :span="23" style="margin: 0px 80px 20px 40px" class="chargeItemsVo-input">
                    <el-table :data="form.chargeItemsVo" border>
                      <el-table-column label="收费项名称" prop="chargeProjectName" align="center">
                        <template slot-scope="{ row }">
                          <el-input v-if="row.canEdit == 3" v-model="row.chargeProjectName"></el-input>
                          <span v-else> {{ row.chargeProjectName }} </span>
                        </template>
                      </el-table-column>

                      <el-table-column label="单价" prop="unitPrice" align="center">
                        <template slot-scope="{ row }">
                          <el-input v-if="row.canEdit == 3" v-model="row.unitPrice"
                                    @keyup.native="row.unitPrice = oninput(row.unitPrice, 2); jisuanMoney(row)">
                            <el-button slot="append">元</el-button>
                          </el-input>
                          <span v-else> {{ row.unitPrice }} </span>
                        </template>
                      </el-table-column>

                      <el-table-column label="收费类型" prop="chargeItemsType" align="center">
                        <template slot-scope="{ row }">
                          <el-select v-if="row.canEdit == 3" v-model="row.chargeItemsType" clearable @change="changeChargeType(row, $event)">
                            <el-option label="按天" :value="2"></el-option>
                            <el-option label="按次" :value="1"></el-option>
                          </el-select>
                          <span v-else> {{ {2: '按天', 1: '按次', 4: '按小时', 5: '按月'}[Number(row.chargeItemsType)] }}</span>

                        </template>
                      </el-table-column>

                      <el-table-column label="数目" prop="number" align="center">
                        <template slot-scope="{ row }">
                          <el-input v-if="row.canEdit == 3 && 1==row.chargeItemsType" v-model="row.number"
                                    @keyup.native="row.number = oninput(row.number, 0,row.upperLimitOfNumber>=0?row.upperLimitOfNumber:999999);jisuanMoney(row) "></el-input>
                          <span v-else> {{ row.number }}</span>
<!--                          <span > {{ row.number }}</span>-->
                        </template>
                      </el-table-column>


                      <el-table-column label="费用" prop="chargeMoney" align="center">
                        <template slot-scope="{ row }">
                          {{ Number(row.chargeMoney).toFixed(2) }} 元
                        </template>
                      </el-table-column>
                      <el-table-column label="操作" align="center">
                        <template slot-scope="{ row }">
                          <el-button v-if="row.canEdit == 3" type="danger" icon="el-icon-delete" size="mini" @click="deleteChargingItems(row)"></el-button>
                        </template>
                      </el-table-column>
                    </el-table>
                  </el-col>

                  <el-col :span="24" style="text-align: center;margin-bottom: 10px">
                    <el-button icon="el-icon-plus" @click="addChargingItems">添加收费项</el-button>
                  </el-col>
                </el-row>
              </template>

              <template v-if="false">
                <el-row>
                  <el-col :span="24">
                    <MmvTitle title="其他信息"></MmvTitle>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="分配负责人">
                      <div style="display: flex;align-items: center;">
                        <el-input :value="form.headName" placeholder="请选择人员" clearable
                                  @click.native="showHead = true;" readonly>
                          <el-button icon="el-icon-search" slot="append"></el-button>
                        </el-input>
                      </div>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="分配司机">
                      <div style="display: flex;align-items: center;">
                        <el-input v-model="form.driverName" placeholder="请选择人员" clearable
                                  @click.native="showDriver = true;" readonly>
                          <el-button icon="el-icon-search" slot="append"></el-button>
                        </el-input>
                      </div>
                    </el-form-item>
                  </el-col>

                  <el-col :span="24">
                    <el-form-item label="订单说明" prop="remark">
                      <el-input v-model="form.remark" type="textarea" :style="{ width: '73vw' }" placeholder="请输入订单说明"
                                :maxlength="300" show-word-limit :autosize="{ minRows: 2, maxRows: 3 }"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>

              </template>
            </el-row>
          </el-form>

        </div>
      </template>
      <template v-slot:footer>
        <div class="footer">
          <el-button type="primary" :loading="loading" @click.native="saveOrder">保存</el-button>
          <el-button type="info" plain @click.native="close">取消</el-button>
        </div>
      </template>
    </CustomContent>

<!--    司机列表-->
    <el-dialog title="选择司机" :visible.sync="showDriver" width="1000px" destroy-on-close
               append-to-body @close="showDriver = false">
      <MmvDingdanfenpei ref="MmvDingdanfenpei" :storeId="form.storeId" :driverType="form.driverType" v-if="showDriver" @success="selDriver"></MmvDingdanfenpei>
      <div slot="footer">
        <el-button @click="showDriver = false">关闭
        </el-button>
      </div>
    </el-dialog>

<!--负责人列表-->
    <el-dialog :title="'订单负责人'" :visible.sync="showHead" width="1000px" destroy-on-close
               append-to-body @close="showHead = false">
      <MmvDingdanfenpei ref="MmvFuzerenfenpei" v-if="showHead" @close="fuzerenfenpei"></MmvDingdanfenpei>
      <div slot="footer">
        <el-button @click="showHead = false">关闭
        </el-button>
      </div>
    </el-dialog>

    <!-- 新增会员 -->
    <el-dialog title="添加会员" :visible.sync="showAddCustomer" width="1100px" destroy-on-close append-to-body>
      <MmvAdd ref="MmvAdd" v-if="showAddCustomer" :editid="null"></MmvAdd>
      <div slot="footer">
        <el-button @click="showAddCustomer = false">取消</el-button>
        <el-button type="primary" @click="addCustomer" :loading="saveLoading">确定
        </el-button>
      </div>
    </el-dialog>
    <!-- 选择门店 -->
    <MmvMendian :show="showStore" v-if="showStore" @success="chooseStore" :all="true"></MmvMendian>
    <!--地图选点取车 -->
<!--    <el-dialog title="地图选点" :visible.sync="positionShow" width="800px" append-to-body>-->
<!--      <position :showText="false" @input="getMapInfo" :areaName="takeAddress" v-if="positionShow"/>-->
<!--      <div slot="footer" class="dialog-footer">-->
<!--        <el-button type="primary" @click="positionShow = false">确定</el-button>-->
<!--      </div>-->
<!--    </el-dialog>-->
    <!--地图选点还车 -->
<!--    <el-dialog title="地图选点" :visible.sync="positionShow2" width="800px" append-to-body>-->
<!--      <position :showText="false" @input="getMapInfo2" :areaName="alsoAddress" v-if="positionShow2"/>-->
<!--      <div slot="footer" class="dialog-footer">-->
<!--        <el-button type="primary" @click="positionShow2 = false">确定-->
<!--        </el-button>-->
<!--      </div>-->
<!--    </el-dialog>-->
    <!-- 选择车型 -->
    <el-dialog title="选择车型" width="1100px" destroy-on-close append-to-body :visible.sync="showCarModel">
      <MmvChexing ref="MmvChexing" @checked="chooseCarModel" :storeId="form.storeId"
                  :useTimeType="form.useTimeType" v-if="showCarModel"></MmvChexing>
    </el-dialog>
    <!-- 选择客户 -->
    <el-dialog title="选择客户" width="1100px" destroy-on-close append-to-body :visible.sync="showCustomer">
      <MmvMember ref="MmvMember" v-if="showCustomer" @success="chooseCustomer"></MmvMember>
    </el-dialog>

  </div>
</template>

<script>

import MmvMendian from "@/views/components/selectStore.vue";
import MmvChexing from "@/views/charteredBus/order/components/chexing.vue";
import Template from "@/views/system/template/index.vue";
import MmvDingdanfenpei from "@/views/charteredBus/order/components/dingdanfenpei.vue";
import MmvAdd from "@/views/member/add.vue";
import MmvMember from "@/views/components/selectMember.vue";
import MmvTitle from "@/components/MmvUI/MmvTitle.vue";
import CustomContent from "@/components/custom/content.vue";
import position from "@/components/BaiduMap/baiduMapSeach.vue";
import HistoryOrderRemark from "@/views/order/orderBasic/components/historyOrderRemark.vue";
import MmvPeiche from "@/views/order/orderBasic/pageche.vue";
import {charteredBusadd, charteredBuseditInfo, charteredBusUpdate, confirmationOrder} from "@/api/charteredBus/add";
import moment from 'moment'
import {addTemplate, updateTemplate} from "@/api/contract/template";

export default {
  // import 引入的组件需要注入到对象中才能使用
  name:'AddCharterOrder',
  components: {MmvPeiche, HistoryOrderRemark, position, CustomContent, MmvTitle, MmvMember, MmvAdd, MmvDingdanfenpei, Template, MmvChexing, MmvMendian},
  props: {},
  data() {
    // 这里存放数据
    return {
      loading:false,
      showCustomer:false,
      showAddCustomer:false,
      showStore:false,
      showCarModel:false,
      orderTimeRange:[],
      showHead:false,
      showDriver:false,
      orderNo:'',//预留编辑回显
      kehu:{},
      form:{
        memberName:null,
        memberNo:null,
        kilometers:0,
        setUseTimes:1,
        region:null,
        useTimeType:1,
        storeName:null,
        storeId:null,
        reserveStoreName:null,
        reserveStoreId:null,
        rentalStartTime:null,
        rentalEndTime:null,
        rent:null,
        headName:null,
        remark:null,

        charteredBusPlanId:null,
        modelInfo:null,
        deposit:null,
        chargeItemsVo:[],
        isUseDriver:1,
        driverType:1,
        tenancyTerm:1,
        methodPayment:2,
        driverId:null,
        driverName:null,
        valetDrivingFee:null,
      },
      saveLoading:false,
      mendianType: 'quchemendian',
      rules: {
        memberName: [
          {required: true, message: '请选择客户', trigger: 'change'}
        ],
        useTimeType: [
          {required: true, message: '请选择方案类型', trigger: 'blur'}
        ],
        storeName: [
          {required: true, message: '请选择取车门店', trigger: 'change'}
        ],
        // reserveStoreName: [
        //   {required: true, message: '请选择还车门店', trigger: 'blur'},
        // ],
        rentalStartTime: [
          {required: true, message: '请选择预定时间', trigger: 'change'},
        ],
        methodPayment: [
          {required: true, message: '请选择结算方式', trigger: 'blur'},
        ],
        modelInfo: [
          {required: true, message: '请选择车型', trigger: 'change'}
        ],
        isUseDriver: [
          {required: true, message: '请选择是否需要司机', trigger: 'blur'},
        ],
        valetDrivingFee: [
          {required: true, message: '请输入代驾费', trigger: 'blur'},
        ],
        rent: [
          {required: true, message: '请输入车辆租金', trigger: 'blur'},
        ],
        deposit: [
          {required: true, message: '请输入车辆押金', trigger: 'blur'}
        ],
      }
    }
  },
  // 计算属性 类似于 data 概念
  computed: {
    totalRent(){
      let allmoney = this.form.chargeItemsVo.reduce((pre, cur, index, arr)=>{
        return pre.chargeMoney+cur.chargeMoney
      }, 0);
      console.log('变化了', allmoney)
      this.form.rent = allmoney
    }
  },
  watch:{
    'form.chargeItemsVo':{
      handler:function(oldval, val){
        // this.form.rent = this.form.chargeItemsVo.reduce((pre, cur, index, arr)=>{
        //   return pre.chargeMoney+cur.chargeMoney
        // }, 0);

        let sum = this.form.chargeItemsVo.reduce(function(prev, cur, index, arr) {
          console.log(prev, cur, index);
          return {
            chargeMoney:Number(prev.chargeMoney)+Number(cur.chargeMoney)
          }
        }, { chargeMoney: 0 })
        this.form.rent = sum.chargeMoney
        console.log('sum==', sum)
        console.log('chargeItemsVo==', this.form.chargeItemsVo)
        console.log('rent==', this.form.rent)
      },
      deep:true,
      immediate: true
    }
  },
  // 方法集合
  methods: {

    changeChargeType(chargeItem, val){
      console.log('------------------',val, chargeItem)
      if (val == 2) {//按天
        chargeItem.number=this.form.days
      }else if(val == 1) {//按次
        chargeItem.number=1
      }
      this.jisuanMoney(chargeItem)
    },

    calcEndTime(value){
      console.log('calcEndTime', this.form.rentalStartTime, this.form.tenancyTerm)

      if(3==this.form.useTimeType){
        if(this.form.rentalStartTime === null || this.form.rentalStartTime === undefined
          || this.form.rentalStartTime === ''
          || this.form.tenancyTerm === null
          || this.form.tenancyTerm === undefined
          || this.form.tenancyTerm === ''
        ){
          this.form.rentalEndTime = null
        }else {
          this.form.rentalEndTime = moment(this.form.rentalStartTime).add(this.form.tenancyTerm, 'months').format('YYYY-MM-DD HH:mm:ss')
        }

      }

      this.getFeeData();

      console.log('aaa', moment(this.form.rentalStartTime).add(this.form.tenancyTerm, 'months').format('YYYY-MM-DD HH:mm:ss'))
    },
    //选择客户
    chooseCustomer(obj){
      this.showCustomer=false
      console.log('选择客户', obj)
      this.form.memberName = obj.memberName
      this.form.memberNo = obj.memberNo
    },
    // 新增客户
    addCustomer(){

    },
    //选择车型
    chooseCarModel(carModelInfo){
      if(this.form.rentalStartTime === null || this.form.rentalStartTime === undefined || this.form.rentalStartTime === ''){
        this.$message.error('请先选择预定时间')
        return
      }

      console.log('我是车型信息---', carModelInfo)
      this.showCarModel = false

      this.form.charteredBusPlanId = carModelInfo.charteredBusPlanId
      this.form.modelInfo = carModelInfo.modelInfo
      this.form.rent = carModelInfo.rent
      this.form.deposit = carModelInfo.deposit
      this.form.setUseTimes = carModelInfo.setUseTimes
      this.form.kilometers = carModelInfo.kilometers

      this.getFeeData();
    },
    getFeeData(){
      if(this.form.charteredBusPlanId === null || this.form.charteredBusPlanId === undefined || this.form.charteredBusPlanId === ''
      ||this.form.useTimeType === null || this.form.useTimeType === undefined || this.form.useTimeType === ''){
        return
      }

      confirmationOrder({
        charteredBusPlanId:this.form.charteredBusPlanId,
        startTime:this.form.rentalStartTime,
        endTime:this.form.rentalEndTime,
        takeStoreId:this.form.storeId,
        useTimeType:this.form.useTimeType
      }).then(res=>{
        console.log('取到费用数据', res)

        if(res.code == 200){
          this.form.deposit = res.data.deposit
          this.form.rent = res.data.rent
          this.form.days = res.data.days
          this.form.tenancyTerm = res.data.tenancyTerm
          this.form.chargeItemsVo = res.data.chargingItemsVoList

          this.form.chargeItemsVo.forEach(item=>{
            item.canEdit=1
          })

        }else {
          this.form.deposit = null
          this.form.rent = null
          this.form.days = null
          this.form.tenancyTerm = null
          this.form.chargeItemsVo = []
        }

      }).catch(e=>{
        this.form.deposit = null
        this.form.rent = null
        this.form.days = null
        this.form.tenancyTerm = null
        this.form.chargeItemsVo = []
      })
    },
    // 选择门店
    chooseStore(storeInfo){
      console.log('选择门店了', storeInfo)
      this.showStore = false
      if(storeInfo != null && storeInfo.storeId != null){
        if (this.mendianType == "quchemendian") {
          this.form.storeId = storeInfo.storeId
          this.form.storeName = storeInfo.storeName
        }else if(this.mendianType == "huanchemendian"){
          this.form.reserveStoreId = storeInfo.storeId
          this.form.reserveStoreName = storeInfo.storeName
        }
      }

      this.getFeeData();
    },
    addChargingItems() {
      if(this.form.chargeItemsVo===null || this.form.chargeItemsVo.length<=0){
        this.$message.error('请先选择车型')
        return
      }

      // number: this.form.days,
      this.form.chargeItemsVo.push({
        chargeProjectName: '',
        unitPrice: 0,
        chargeItemsType: 1,
        chargeProjectCategory: 9,
        number:1,
        canEdit: 3,
        chargeMoney: 0,
      })
    },
    deleteChargingItems(row) {
      let _index = -1;
      this.form.chargeItemsVo.forEach((item, index) => {
        if (row.chargeProjectName == item.chargeProjectName && item.canEdit == 3) {
          _index = index
        }
      })
      this.form.chargeItemsVo.splice(_index, 1)
    },
    jisuanMoney(row) {
      let chargeMoney = 0
      //1按次 2按天 ）
      // if(row.chargeItemsType==1){
        chargeMoney = (row.unitPrice * row.number)||0;
      // }else {
      //   chargeMoney = (row.unitPrice * row.number * this.form.days)||0;
      // }


      if (row.upperLimitOfAmount!=null&&row.upperLimitOfAmount >= 0 && chargeMoney > row.upperLimitOfAmount) {
        row.chargeMoney = Number(row.upperLimitOfAmount.toFixed(2));
      } else {
        row.chargeMoney = Number(chargeMoney.toFixed(2));
      }
    },
    // 选择门店
    handleChooseStore(type){
      this.showStore =true;
      if (type==1){//取车门店
        this.mendianType = 'quchemendian'
      }else if(type == 2) {//还车门店
        this.mendianType = 'huanchemendian'
      }
    },

    //租赁时间改变
    changeTime(times){
      this.form.rentalStartTime = times[0];
      this.form.rentalEndTime = times[1];


      this.calcEndTime()
    },

    //选择车型
    showSelModel(){
      if(this.form.rentalStartTime === null || this.form.rentalStartTime === undefined || this.form.rentalStartTime === ''){
        this.$message.error('请先选择预定时间')
        return
      }
      this.showCarModel=true
    },

    //切换司机类型
    changeDriverType(){
      if (this.form.driverName) {
        this.form.driverName = null
        this.form.driverId = null
      }
    },
    //选择司机
    selDriver(data){
      console.log('选择了 司机', data)
      this.showDriver = false
      this.form.driverName = data.nickName
      this.form.driverId = data.userId
    },

    showSelDriver(){
      if(this.form.storeId === null ||this.form.storeId === undefined ||this.form.storeId === '' ){
        this.$message.error('请选择取车门店')
        return
      }
      this.showDriver = true
    },

    //保存订单
    saveOrder(){

      // let every = this.form.chargeItemsVo.every(item => {
      //
      //     console.log('item=>', item)
      //     console.log('chargeProjectName', item.chargeProjectName!==null)
      //     console.log('chargeProjectName', item.chargeProjectName!=='')
      //     console.log('chargeMoney', item.chargeMoney!==null)
      //     console.log('chargeMoney', item.chargeMoney!=='')
      //     console.log('chargeItemsType', item.chargeItemsType!==null)
      //     console.log('chargeItemsType', item.chargeItemsType!=='')
      //     console.log('number', item.number!==null)
      //     console.log('number', item.number!=='')
      //     console.log('unitPrice', item.unitPrice!==null)
      //     console.log('unitPrice', item.unitPrice!=='')
      //
      //     return
      //       (
      //         item.chargeProjectName!==null
      //       &&item.chargeProjectName!==''
      //       &&item.chargeMoney!==null
      //       &&item.chargeMoney!==''
      //       &&item.chargeItemsType!==null
      //       &&item.chargeItemsType!==''
      //       &&item.number!==null
      //       &&item.number!==''
      //       &&item.unitPrice!==null
      //       &&item.unitPrice!==''
      //       )
      // });

      // let every = this.form.chargeItemsVo.every(item => {
      //   console.log('item=>', item)
      //   console.log('chargeProjectName', item.chargeProjectName !== null)
      //   console.log('chargeProjectName', item.chargeProjectName !== '')
      //   console.log('chargeMoney', item.chargeMoney !== null)
      //   console.log('chargeMoney', item.chargeMoney !== '')
      //   console.log('chargeItemsType', item.chargeItemsType !== null)
      //   console.log('chargeItemsType', item.chargeItemsType !== '')
      //   console.log('number', item.number !== null)
      //   console.log('number', item.number !== '')
      //   console.log('unitPrice', item.unitPrice !== null)
      //   console.log('unitPrice', item.unitPrice !== '')
      //
      //   return (
      //     item.chargeProjectName !== null &&
      //     item.chargeProjectName !== '' &&
      //     item.chargeMoney !== null &&
      //     item.chargeMoney !== '' &&
      //     item.chargeItemsType !== null &&
      //     item.chargeItemsType !== '' &&
      //     item.number !== null &&
      //     item.number !== '' &&
      //     item.unitPrice !== null &&
      //     item.unitPrice !== ''
      //   );
      // });

      let list = this.form.chargeItemsVo.filter(item=>{
        if(item.chargeProjectName === null ||
          item.chargeProjectName === '' ||
          item.chargeMoney === null ||
          item.chargeMoney === '' ||
          item.chargeItemsType === null ||
          item.chargeItemsType === '' ||
          item.number === null ||
          item.number === '' ||
          item.unitPrice === null ||
          item.unitPrice === ''){
          return item
        }
      })

      if(list.length>0){
        this.$message.error('表单填写未完成')
        return
      }

      let that = this

      this.$refs.form.validate((valid) => {
        if (valid) {
          that.loading=true

          if(that.$route.params && that.$route.params.orderNo){
            that.form.orderNo = that.$route.params.orderNo

            charteredBusUpdate(that.form).then(res=>{
              that.loading=false
              if(res.code==200){
                that.$message.success('提交成功')
                that.close()
              }
            }).catch(e=>{
              that.loading=false
            })
          }else {
            charteredBusadd(that.form).then(res=>{
              that.loading=false
              if(res.code==200){
                that.$message.success('提交成功')
                that.close()
              }
            }).catch(e=>{
              that.loading=false
            })
          }
        }
      })

    },

    close(){
      this.$router.back()
      this.$store.dispatch('tagsView/delView', this.$route)
    }
  },
  // 生命周期 - 创建完成（可以访问当前this 实例）
  created() {
  },
  // 生命周期 - 挂载完成（可以访问 DOM 元素）
  mounted() {
    console.log('===>', this.$route.params)
    let that = this
    if(this.$route.params && this.$route.params.orderNo){
      console.log('编辑包车订单')
      this.$route.meta.title = '编辑包车订单'
      charteredBuseditInfo(this.$route.params.orderNo).then(res=>{
        if(res.code == 200){
          that.form = res.data

          that.orderTimeRange = res.data.rentalStartTime+'至'+res.data.rentalEndTime
          that.form.modelInfo = res.data.modelName

          // that.form.days = res.data.days

          // that.form.chargeItemsVo.forEach(item=>{
          //   item.canEdit=1
          // })
        }

      })
    }else {
      console.log('新增包车订单')
      this.$route.meta.title = '新增包车订单'
    }

  },

}
</script>

<style lang="scss" scoped>
</style>
